<template>
<div>
  <img src="/images/wave.jpg" style="width: 100%" alt="">
  <div>
    <span style="margin: 5px 540px 5px 0px"> 近期因疫情原因，部分地区快递管控无法发货，给您带来不便敬请谅解！<el-link :underline="false"@click="toLogin()"> 去登录 </el-link></span>
    <span @click="myCenter()"><el-link :underline="false"@click="myCenter()"><i class="el-icon-s-custom" ></i >个人中心 </el-link></span>
    <el-divider direction="vertical"></el-divider>
    <span><el-link :underline="false"><i class="el-icon-s-claim"></i> 我的订单 </el-link></span>
    <el-divider direction="vertical"></el-divider>
    <span><el-link :underline="false"><i class="el-icon-message-solid"></i> 活动公告</el-link></span>
  </div>
  <el-container>
    <el-header><div style="background-color: #ea3200">
        <el-menu style="width: 1350px;margin: 0 auto"
                 router
                 default-active="1"
                 class="el-menu-demo"
                 mode="horizontal"
                 background-color="#ea3200"
                 text-color="#fff"
                 active-text-color="#fff">
          <el-menu-item index="/student-bookstore/index"><img src="/images/logo.png" alt=""></el-menu-item>
          <el-menu-item index="/student-bookstore/index">
            <span slot="title">商城首页</span>
          </el-menu-item>
          <el-menu-item index="/student-bookstore/theme">
            <span slot="title">主题出版</span>
          </el-menu-item>
          <el-menu-item index="/student-bookstore/optimize">
            <span slot="title">学子优选</span>
          </el-menu-item>
          <el-menu-item index="/student-bookstore/examine">
            <span slot="title">专业考试</span>
          </el-menu-item>
          <el-menu-item index="/student-bookstore/customize">
            <span slot="title">学子定制</span>
          </el-menu-item>
          <el-menu-item index="/student-bookstore/newtimes">
            <span slot="title">新时代·新经典</span>
          </el-menu-item>

          <div style="float: right;margin: 10px 10px">
            <el-button plain disabled ><i class="el-icon-s-goods"></i> 购物车 10 件 <i class="el-icon-arrow-right "></i></el-button>
          </div>
          <!--搜索框开始-->
          <div style="float: right;margin-top: 10px">
            <!-- @keydown.native.enter 按下回车键-->
            <el-input v-model="wd" @keydown.native.enter="search()" placeholder="请输入搜索内容">
              <!--slot="append"作用是将按钮追加在搜索框的后面-->
              <el-button @click="search()" slot="append" icon="el-icon-search"></el-button>
            </el-input>
          </div>
          <!--搜索框结束-->
        </el-menu>
    </div>
    </el-header>
    <el-main>
      <!-- 将由其它视图组件显示右侧的主体部分 -->
      <router-view/>
    </el-main>
    <el-footer>
      <div style="height: 95px;margin-bottom: 0px"><img src="/images/buttom.png" alt=""></div>
      <el-divider></el-divider>
      <div style="height: 100px;background-color: #3f3f3f;
            padding: 30px;text-align: center;color: #b1b1b1">
        <p> Copyright © 2015-2022 学子书城电子商务有限责任公司  京ICP备12003709号-3 京公网安备 11010802029572号</p>
        <p>营业执照 丨 网络出版服务许可证 （京）字第290号</p>
        <p>出版物经营许可证 新出发 京批字第直200352号 丨 广播电视节目制作经营许可证 （京）字第07439号</p>
        <p>客服热线：4006666505</p>
      </div></el-footer>
  </el-container>

</div>
</template>

<script>
export default {
  data() {
    return {
      wd: '', //搜索的内容
    }
  },
  methods: {
    search(){
      //跳转到结果页面
      location.href="/result.html?wd="+this.wd;
    },
    myCenter(){
      location.href="/my-info"
    },
    toLogin (){
      location.href="/login"
    }
  },
  mounted() {

  }
}
</script>

<style>
* {
  margin: 0;
}
</style>